發布日期:2025 年 5 月 20 日
在 2025 年 Google I/O 大會上,我們推出了全新功能,協助您提升工作效率,並打造更強大、更順暢且更現代化的網頁。
以下 10 項重要創新功能,可讓您直接掌握尖端技術,並確保為下一個專案帶來靈感。
1. 只要幾行 CSS 和 HTML 程式碼,就能輕鬆建立輪轉介面
使用 CSS 建構美觀的輪轉介面,並在首次繪製時提供互動功能。Chrome 135 推出了新的 CSS 基本元素,包括可設定樣式的分割畫面、捲動標記元素和捲動按鈕,讓您不必使用 JavaScript 即可簡化輪轉介面建立作業。使用熟悉的 CSS 概念,在短時間內建立豐富、互動、流暢且更易於存取的輪轉介面。
2. 宣告式彈出式視窗:推出全新的興趣 Invoker API
實驗性 Interest Invoker API 可做為來源試用使用。有了這項功能,您就能在訪客興趣活動啟用一段時間後,以宣告方式切換彈出式視窗。告別無法設定樣式的 [title]
屬性,歡迎 [interesttarget]
!您可以將其與 Anchor Positioning API 和 Popover API 結合使用,不必使用 JavaScript 即可建立豐富、回應式且互動的 UI 元素,例如工具提示或懸停卡片。現代 CSS 的可能性無窮!
3. 我們提供多個內建 AI API,使用 Gemini Nano 等領先模型,現在 Prompt API 也提供多模態功能
我們會持續推動內建 AI 技術,為您提供更優異的隱私權、更短的延遲時間和更低的成本,以及 AI 產生的高品質輸出內容。內建 AI 會使用專家模型和 Gemini Nano (Google 最高效的模型),處理裝置端工作。自 Chrome 138 起,Summarizer API、Language Detector API、Translator API 和 Chrome 擴充功能的 Prompt API 已在穩定版中推出。此外,Writer API 和 Rewriter API 也適用於來源試用版。
Chrome Canary 提供全新的 Proofreader API,以及具備多模式功能的 Prompt API。
如要取得最新資訊,請加入搶先預覽計畫,共同開發新的內建 AI API,並塑造網路 AI 的未來。
4. 用戶端 AI 擴充功能搭配 Firebase 和 Gemini Developer API,提供混合式 AI 解決方案
我們與 Firebase 和 Gemini 開發人員 API 合作,讓您現在可以在行動裝置和電腦上建構 AI 輔助的網頁體驗。這些應用程式會盡可能使用用戶端 AI,並順利擴展至伺服器端 AI,以便觸及所有裝置和瀏覽器。自今天起,Firebase AI 邏輯可讓您透過 Gemini Developer API,順暢存取 Gemini Nano 和類似的較小模型所支援的 Chrome 內建提示 API,並在伺服器端使用這些模型。
5. Chrome 開發人員工具中的 AI 輔助功能可支援您在樣式、效能等方面進行偵錯作業流程
透過AI 協助功能,您可以與 Gemini 進行即時通訊,協助您在「元素」面板中偵錯樣式錯誤、在「效能」面板中解決效能問題、在「網路」面板中找出網路問題,以及在「來源」面板中找出來源檔案。此外,AI 輔助功能現在可直接將樣式相關變更套用至「元素」面板中的原始碼。
6. Chrome 開發人員工具「效能」面板中的真實使用者資料、Lighthouse 洞察資料和 AI 功能,有助於您瞭解並修正效能問題
透過重新設計的成效面板,您現在可以存取本機和實際使用者的 Core Web Vitals 資料,並詢問 Gemini,以便瞭解及修正效能問題。「深入分析」側欄會將 Lighthouse 洞察資料納入追蹤記錄,協助您更快速地進行偵錯作業,而且無須離開工作流程或中斷工作效率。
7. 基準功能現已可在您熟悉的工具中使用,包括 VS Code、ESLint 等
透過基準整合,提高網頁開發工作流程的準確度和信心。您可以在熟悉的網路開發工具中,清楚瞭解各大瀏覽器的網路功能可用性:
- IDE:VSCode 現在會在您建構時顯示功能的基準狀態,JetBrains 的 WebStorm 和以 VS Code 為基礎的 IDE (包括 Firebase Studio、Windsurf、GitHub Codespaces 等) 也即將支援這項功能。
- 檢查器:CSS 和 HTML 檢查器可在您使用比基準目標更新的功能時,主動發出警告。基準值支援 CSS 適用的 ESLint、HTML ESLint 和 Stylelint。
- Analytics:RUMvision 會將基準資料與實際使用者指標合併,讓您有策略地為目標對象選擇最佳的基準版本。Google Analytics 使用者可以將資料上傳至 Google Analytics 基準檢查工具,取得基準建議。
- 編譯器:使用 browserslist-config-baseline 將基準目標插入 Babel 和 PostCSS 等程式碼編譯工具,這樣您就能在原始碼中使用新功能,並在正式版建構中編譯這些功能。
8. 透過 Web Platform Dashboard 全面掌握網站功能支援情形
去年,我們推出了網站平台資訊主頁,讓您可以探索網站功能資料,將整個網站平台對應為一組功能。由於網頁功能資料集現在已 100% 對應,您可以首次查看每個瀏覽器中每項功能的基準狀態,包括 AVIF 和 View 轉場,以及這些功能的可用性和採用率。掌握最新資訊,安心建構應用程式!
9. 開發人員試用計畫:透過 Credential Manager 提供簡化登入體驗
我們瞭解多種驗證方法 (包括密碼、身分識別聯合作業和密碼金鑰) 可能會對網站使用者造成的摩擦。我們的目標是為使用者提供統一且輕鬆的登入體驗,因此我們將 Android 的憑證管理工具直覺化體驗帶到 Chrome 中。不久之後,當使用者點選「登入」時,Chrome 就會顯示可用於該網站的憑證,例如 Google 密碼管理工具中的密碼金鑰和密碼,讓登入過程更加順暢。我們也打算在這項體驗中加入身分識別聯合作業功能。目前網站的憑證管理工具處於開發人員試用階段,敬請密切留意今年稍晚的更多更新。
10. 透過取消提交審查的功能,更快地進行 Chrome 擴充功能的疊代作業
提交 Chrome 擴充功能時,應該能感受到流暢、無後顧之憂和令人興奮的體驗! 不過,我們瞭解在等待審查的提交內容中,無法快速修正錯誤是使用者遇到的一個問題。今年稍早,我們推出了取消待提交內容的功能,這項功能建立在回溯先前發布版本的功能之上,目的是讓您快速進行變更並重新提交。
如需最新資訊,請造訪 developer.chrome.com 和 web.dev,進一步瞭解我們如何打造功能強大的網路,並讓使用體驗更輕鬆。別忘了在 X、YouTube 和 LinkedIn 上與我們聯絡。我們在下次 I/O 見!
Deloitte 是指一或多家 Deloitte Touche Tohmatsu Limited (英國私人保證有限責任公司,簡稱「DTTL」)、其跨國集團旗下公司或相關實體。DTTL 及旗下各公司,依法均為各自獨立的實體。DTTL (也稱為「Deloitte Global」) 不會為客戶提供服務。在美國,Deloitte 是指 DTTL 在美國的一個或多個成員公司,以及在美國以「Deloitte」為名營運的相關實體,以及各自的關係企業。根據公認會計規則和法規,您可能無法向客戶提供某些認證服務。如要進一步瞭解我們的全球成員公司網路,請前往 www.deloitte.com/about。